<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset = "UTF-8">
    <script src="{{url_for('static',filename='js/jquery.min.js')}}"></script>
    <script src="{{url_for('static',filename='js/permissionManage.js')}}?{{ version }}"></script>
    <script src="{{url_for('static',filename='js/bootstrap.min.js')}}"></script>
    <link rel="stylesheet" href="{{url_for('static',filename='css/bootstrap.min.css')}}">
    <style>
    .button{
        background-color: white;
        color: black;
        border: 2px solid #4CAF50;
    }

    .button:hover {
        background-color: #4CAF50;
        color: white;
    }

    .button[disabled] {
        opacity: 0.6;
        cursor: not-allowed;
    }

    </style>
    <title>客户管理</title>
</head>
<body>
        <nav class="navbar navbar-default" role="navigation">
    <div class="container-fluid">
    <div class="navbar-header">
        <a class="navbar-brand" href="#">添之咨询后台管理系统</a>
    </div>
    <div>
        <ul class="nav navbar-nav">
            <li ><a href="{{ url_for('start_web') }}">首页</a></li>
            <li ><a href="{{ url_for('permission_manage') }}">权限配置</a></li>
        </ul>
        <ul class="nav navbar-nav navbar-right">
            <li class="dropdown">
                <a href="#" class="dropdown-toggle" data-toggle="dropdown">
                    管理员{{ session['admin'] if session['admin'] else "未登录" }}
                    <b class="caret"></b>
                </a>
                <ul class="dropdown-menu">
                    <li><a href="{{ url_for("login_out") }}">退出</a></li>
                </ul>
            </li>
        </ul>
    </div>
    </div>
</nav>

<div id="client_manage" style="margin:auto; width:95%">


    <h3>权限配置</h3>
    <div>
        <div style="display:inline-block;">
           <button type="button" class="btn btn-success" onclick="addClient()">添加管理员</button>
        </div>
        <div  id = "submit" style="position:absolute;left:50%;display:inline-block;">
           <button type="button" class="btn btn-success" onclick="cancel()">取消添加</button>
        </div>
    </div>

    <br/>
    <br/>
    <div style="margin:auto">

    <div id="clientManageDataTable" class="table table-striped table-bordered" cellspacing="0" width="95%">
    </div>
    </div>

</div>

`
<script>

        function addClient() {
            var inputList = $(".no-editor");
            if (inputList.length>0){
                return;
            }
            var go = window.confirm("您确定要添加管理员吗?")
            if (go == false){
                return;
            }
            var tdList = $("#clientManageDataTable").find('table > tbody > tr >td');
            var widthList = [];
            tdList.each(function(key,value){
                var value = $(value).width();
                widthList.push(value);
            });
            var trList = $("#clientManageDataTable").find('table > tbody > tr');
            var trLength = String(trList.length+1);


            var rowStr = jQuery('<tr></tr>');
            var indexHtml = jQuery('<td>' + trLength + '</td>');
            rowStr.append(indexHtml);

            var userNameWidth = widthList[1];
            var userNameHtml = jQuery('<td>' +'<input type="text" style="width:'+String(userNameWidth)+'px;" ' +
                'class="user-name"/>' + '</td>');
            rowStr.append(userNameHtml);

            var passwordWidth = widthList[2];
            var passwordHtml = jQuery('<td>' +'<input type="text" style="width:'+String(passwordWidth)+'px;" ' +
                'class="password"/>' + '</td>');
            rowStr.append(passwordHtml);

            var strategy_list = [];
            var checkboxList = $(".editor" + "[type='checkbox']");
            checkboxList.each(function (key,value) {
                var strategy = $(value).attr('class').split(' ')[2];
                if (strategy_list.indexOf(strategy) == -1){
                    strategy_list.push(strategy);
            }
            });
            var strategyWidth = widthList[3];
            var strategyHtml = '';
            for (var i =0;i<strategy_list.length;i++){
                strategyHtml += '<label><input class="no-ediotr"  type="checkbox" ' +
                'disabled=true value="" checked/>' + strategy_list[i]+ '</label>&nbsp;';
            }
            strategyHtml = jQuery('<td onclick="noEditor()">' + strategyHtml + '</td>');
            rowStr.append(strategyHtml);


            var buttonWidth = widthList[4];
            var buttonHtml = jQuery('<td colspan="2"><button class="button no-editor" style="width:'+String(buttonWidth)+'px;" type="text" onclick="submit()" >提交</button></td>');
            rowStr.append(buttonHtml);

            $("#clientManageDataTable").find('table > tbody').append(rowStr);
            $("#submit").show();
            var h = $(document).height()-$(window).height();
            $(document).scrollTop(h);
        }
        function noEditor() {

            window.alert("请先提交后再进行配置!");
        }


        function selectStrategy(accountId,strategy) {

            if ($("." + accountId +"."+strategy+ "[type='checkbox']").is(':checked')) {

                window.alert("你已经为管理员 " + accountId + " 添加"+strategy +"权限" );
                var permission_status = '1';
            } else {
                var permission_status = '0';
                window.alert("你已经为管理员 " + accountId + "解除"+ strategy +"的权限" );
            }
            $.ajax({
                url: "/adminPermissionStatus",
                async: true,
                type: 'POST',
                data: JSON.stringify({'user_name': accountId,'permission':strategy,'permission_status':permission_status}),
                dataType: 'json',
                success: function (result) {
                    var message = result.message;
                    alert(message);
                    $("#submit").hide();
                    refreshData();
                }
            });

        }

        function delAdmin(user_name) {
            var go = window.confirm("你确定要删除管理员" + user_name + "吗？");
            if (go == false) {
                return;
            }
            $.ajax({
                url: "/delAdmin",
                async: true,
                type: 'POST',
                data: JSON.stringify({'user_name': user_name}),
                dataType: 'json',
                success: function (result) {
                    var message = result.message;
                    alert(message);
                    refreshData();
                    location.reload();
                }
            });
        }

        function cancel() {
            location.reload();
        }

        function submit() {

            var userName = $(".user-name").val();
            if (userName == '') {
                window.alert("用户名不能为空!");
                return;
            }
            var password = $(".password").val();
            if (password == '') {
                window.alert("密码不能为空!");
                return;
            }

            if (accountList.indexOf(userName) > -1){
                window.alert("该用户已经存在!")
                return;
            }

            var alertStr = "请核对:\n";

            alertStr += "用户名: " + userName + "\n";
            alertStr += "密码: " + password + "\n";

            var go = window.confirm(alertStr);
            if (go == false) {
                return;
            }
            $.ajax({
                url: "/addAdmin",
                async: true,
                type: 'POST',
                data: JSON.stringify({'user_name': userName,'password':password}),
                dataType: 'json',
                success: function (result) {
                    var message = result.message;
                    alert(message);
                    $("#submit").hide();
                    refreshData();
                }
            });

        }

        $("#submit").hide();
        var clientManageDataTable = null;
        var accountList = [];

        clientManageDataTable = jQuery("#clientManageDataTable").raytable({
            datasource: {data: [], keyfield: 'stock_code'},
            columns: [
                {field: "user_name", title: "用户名"},
                {field:"password",title:"密码"},
                {field: "permissions", title: "权限"},
                {field: "newest_visit_time", title: "最近访问时间"},
                {field: "del_admin", title: "删除"}
            ],
            pagesize: 20,
            maxPageButtons: 5,
            rowNumbers: true
        });

        function refreshData() {
            $.ajax({
                url: "/permissionManageData",
                async: true,
                success: function (result) {

                    if (jQuery.type(result)=="string"){
                        var obj = JSON.parse(result);
                    }else{
                        var obj = result;
                    }
                    var resultList = obj.resultList;
                    for (var i=0;i<resultList.length;i++){
                        accountList.push(resultList[i]['user_name']);
                    }
                    clientManageDataTable.data(resultList, 'stock_code');
                }
            })
        }
        refreshData();

</script>

</body>
</html>